<template>
    <h1>条件渲染</h1>
    <h1 v-if="demo">demo为true时我被渲染</h1>
    <button @click="disable">改变demo的值</button>



    <h1 v-if="demo">demo为true</h1>
    <h1 v-else>demo为false😢</h1>
</template> 
 

  
<script setup>
import { ref, reactive, computed } from "vue";
const demo = ref(true)
const disable = () => {
    // vue3需要使用.value来获取值，如果是vue2 就是用this
    demo.value = !demo.value
}

</script>



